import { Space } from 'antd';
import React from 'react';
import { useSelector } from 'dva';
import styles from './Avatar.less';
import people from './user.svg';

const Avatar = ({ className = '', ...otherProps }) => {
  const { userInfo } = useSelector(state => state.user);

  return (
    <div className={`${styles.root} ${className}`} {...otherProps}>
      <Space>
        <img alt="people" src={people} />
        {userInfo?.userName ? <span>{userInfo?.userName}</span> : null}
      </Space>
    </div>
  );
};

export default React.memo(Avatar);
